import React, {Component} from "react";
import {
	View,
	Text,
	Image,
} from "react-native";
import {TabNavigator} from "react-navigation";

import styles from "../containers/style";

class ShoppingIndex extends Component {
	static navigationOptions = {
		tabBarLabel: "商城",
		tabBarIcon: ({tintColor}) => (
			<Image 
				source={require('../images/shopping.png')}
				style={[{tintColor: tintColor}, styles.iconImage]}
			/>
		),
	}
	constructor(props) {
		super(props)
	}
	render() {
		return (
			<Text>这是商城的首页</Text>
		);
	}
}

class CategoryPage extends Component {
	static navigationOptions = {
		tabBarLabel: "分类",
		tabBarIcon: ({tintColor}) => (
			<Image 
				source={require('../images/shopping.png')}
				style={[{tintColor: tintColor}, styles.iconImage]}
			/>
		),
	}
	constructor(props) {
		super(props)
	}
	render() {
		return (
			<Text>这是商城的首页</Text>
		);
	}
}

export default TabNavigator({
	shoppingIndex: {
		screen: ShoppingIndex,
	},
	categoryPage: {
		screen: CategoryPage,
	},
}, {
	initalRouteName: "shoppingIndex",
	tabBarPosition: "bottom",
	swipeEnabled: false,
	animationEnabled: false,
	tabBarOptions: {
		showIcon: true,
		style: {
			backgroundColor: "red",
		},
	},
})